<template>
  <div class="main-container">
    <div style="background-color: #fff;height:100%">
      <a-tabs :lazy-load="true" type="card" @change="tabsChange" justify>
        <a-tab-pane title="洗机预测" key="1">
          <div style="height: 100%;">
            <WashingMachinePrediction></WashingMachinePrediction>
          </div>
        </a-tab-pane>
      </a-tabs>
    </div>

  </div>
</template>

<script lang="ts">

import {defineComponent, reactive, ref} from 'vue'

import emitter from '@/hooks/useEventBus'
import WashingMachinePrediction from '@/components/ProductionManagement/WashingMachinePrediction/index.vue'

export default defineComponent({
  name: 'WashingMachinePredictionTabs',
  components: {WashingMachinePrediction},
  setup() {

    const pageData = reactive({
      tableIndex: "1"
    })
    const tabsChange = (e: string | number) => {
      emitter.emit('WashingMachinePrediction')
    }
    return {
      pageData,
      tabsChange
    }
  }
})
</script>
<style scoped>
.main-container {
  height: 100%;
}

:deep(.ag-cell) {
  border-right: 1px solid #dde2eb;
}

:deep(.ag-header-cell) {
  border-right: 1px solid #dde2eb;
}

:deep(.ag-cell-value) {
  user-select: initial;
  -moz-user-select: text;
  -ms-user-select: text;
  -webkit-user-select: text;
}
</style>